<template>
	<view class="ccontainer cflex_items">
		<scroll-view scroll-y style="height:100vh;" scroll-anchoring @scrolltolower="scrolltolower" refresher-enabled
		 :refresher-triggered="triggered" @refresherrefresh="refresherrefresh">
			<view class="cflex cflex_col cflex_items">
				<view v-if="listType == 1" class="listBlock cflex cflex_row cflex_between cflex_items cflex_wrap">
					<block v-for="(item,index) in list" :key="index">
						<view class="bargainItem cflex cflex_col" @click="turnDetail" data-type="1" :data-id="item.spec_id">
							<image :src="item.images[0]" mode=""></image>
							<view class="cflex cflex_col cflex_1">
								<view class="againItem-name">{{item.name}}</view>
								<view class="againItem-type_name">{{item.type_name}}</view>
								<view class="againItem-factory_price">出厂价：{{item.factory_price}}元</view>
								<view class="againItem-num">起订量：{{item.num}}件</view>
							</view>
						</view>
					</block>
				</view>
				<view v-if="listType == 2" class="listBlock cflex cflex_row cflex_between cflex_items cflex_wrap">
					<block v-for="(item,index) in list" :key="index">
						<view class="bargainItem cflex cflex_col" @click="turnDetail" data-type="2" :data-id="item.spec_id">
							<image :src="item.images[0]" mode=""></image>
							<view class="bargainItem-name">{{item.name}}</view>
							<view class="bargainItem-type_name">{{item.type_name}}</view>
							<view class="bargainItem-factory_price">预计采购数量：{{item.estimate_num}}件</view>
							<view class="bargainItem-num">预算：{{item.estimate}}元</view>
						</view>
					</block>
				</view>
				<view v-if="listType == 3" class="listBlock">
					<block v-for="(item,index) in list" :key="index">
						<view class="bargainItem cflex cflex_col" @click="turnDetail" data-type="3" :data-id="item.spec_id">
							<image :src="item.images[0]" mode=""></image>
							<view class="cflex cflex_col cflex_1">
								<view class="againItem-name">{{item.name}}</view>
								<view class="againItem-type_name">{{item.type_name}}</view>
								<view class="againItem-factory_price">出厂价：{{item.factory_price}}元</view>
								<view class="againItem-num">起订量：{{item.num}}件</view>
							</view>
						</view>
					</block>
				</view>
			</view>
			<view class="nomore flex flex_row flex_center" v-if="!isMore">{{ getmore }}</view>
			<view class="nomore flex flex_row flex_center" v-if="isMore">{{ nomore }}</view>
		</scroll-view>
	</view>
</template>

<script>
	import {
		ajax
	} from '../../ajax.js';
	import uniTabBar1 from '../../components/uni-tabBar1';
	import uniTabBar2 from '../../components/uni-tabBar1';
	export default {
		components: {
			uniTabBar1,
			uniTabBar2
		},
		data() {
			return {
				statusBarHeight: '',
				classType: '',
				listType: '',
				triggered: false,
				firstNum: 1,
				num: 6,
				list: [],
				isLoading: true, //是否可滚动
				isMore: true, //是否有数据
				nomore: '',
				getmore: '',
			}
		},
		onReady: function() {
			let that = this
			if (that.listType == 3) {
				uni.setNavigationBarTitle({
					title: "已下单推送"
				})
			} else if (that.listType == 2) {
				uni.setNavigationBarTitle({
					title: "询价推送"
				})
			} else if (that.listType == 1) {
				uni.setNavigationBarTitle({
					title: "商品推送"
				})
			}
			console.log('listType', that.listType)
		},
		onShow: function() {
			let that = this
			that.classType = uni.getStorageSync('class')
			uni.getSystemInfo({
				success: function(res) {
					console.log(res)
					let statusBarHeight = parseFloat(res.statusBarHeight * 2)
					that.statusBarHeight = statusBarHeight
				}
			})
		},
		onLoad(opt) {
			let that = this
			// that.listType = opt.type
			that.listType = 1
			that.getList()
		},
		methods: {
			turnDetail(e){
				let type = e.currentTarget.dataset.type
				let id = e.currentTarget.dataset.id
				if(type == 1){
					uni.navigateTo({
						url:'/pages/detailPro/detailPro?id=' + id
					})
				}
			},
			getList() {
				let that = this
				uni.showLoading({
					title: "加载中"
				})
				ajax({
					url: 'goods/indexList',
					data: {
						token: uni.getStorageSync('token'),
						firstNum: that.firstNum,
						num: that.num,
						type: that.listType
					},
					header: {
						'content-type': 'application/json' //自定义请求头信息
					},
					method: 'POST',
					success: function(res) {
						uni.hideLoading()
						let result = res.data.data
						console.log('result', result);
						if (res.data.code == 1) {
							let list = result.data
							if (that.firstNum == 1) {
								if (list.length != 0) {
									that.list = list
									// console.log('that.list',that.list)
								}
							} else {
								let listItem = list
								if (listItem.length != 0) {
									that.list = that.list.concat(listItem)
								}
							}

							console.log('that.list', that.list);

							let total = result.total;
							that.last_page = result.last_page;

							if (total == 0) {
								that.isLoading = true; //是否可滚动
								that.isMore = true; //是否有数据
								that.nomore = '暂无相关内容~';
								that.getmore = '';
							} else {
								that.isLoading = false; //是否可滚动
								that.isMore = false; //是否有数据
								that.nomore = '暂无相关内容~';
								that.getmore = '';
							}
							if (that.firstNum < that.last_page) {
								that.isLoading = false; //是否可滚动
								that.isMore = false; //是否有数据
								that.nomore = '没有更多内容了~';
								that.getmore = '';
							} else if ((that.firstNum = that.last_page)) {
								that.isLoading = true; //是否可滚动
								that.isMore = true; //是否有数据
								that.nomore = '没有更多内容了~';
								that.getmore = '';
							} else {
								that.isLoading = true; //是否可滚动
								that.isMore = true; //是否有数据
								that.nomore = '没有更多内容了~';
								that.getmore = '';
							}
						}
					},
					error: function() {
						uni.showToast({
							title: res.data.msg,
							duration: 1500,
							icon: 'none'
						});
					}
				});
			},
			refresherrefresh() {
				let that = this;
				that.triggered = true;
				// uni.showLoading({
				// 	title: '努力刷新中'
				// });
				that.firstNum = 1;
				that.getList();
				setTimeout(() => {
					that.triggered = false;
					// uni.hideLoading()
				}, 1500)
			},
			scrolltolower() {
				let that = this;
				console.log(111);
				uni.showLoading({
					title: '努力加载中'
				});
				if (that.firstNum < that.last_page) {
					that.firstNum = that.firstNum + 1;
					that.isLoading = false; //是否可滚动
					that.isMore = false; //是否有数据
					that.nomore = '没有更多内容了~';
					that.getmore = '';
					that.getList();
					uni.hideLoading();
				} else if ((that.firstNum = that.last_page)) {
					that.isLoading = true; //是否可滚动
					that.isMore = true; //是否有数据
					that.nomore = '没有更多内容了~';
					that.getmore = '';
					uni.hideLoading();
				} else {
					that.isLoading = true; //是否可滚动
					that.isMore = true; //是否有数据
					that.nomore = '没有更多内容了~';
					that.getmore = '';
					uni.hideLoading()
				}
			}
		}
	}
</script>

<style>
	page{
		background-color: #fff;
	}
	.listBlock {
		width: 653rpx;
		background: #ffffff;
		border-radius: 20rpx;
		margin-bottom: 22rpx;
		padding-top: 47rpx;
	}
	
	/* ======================================== */
	
	.againItem-name{
		font-size: 28rpx;
		font-weight: 500;
		color: #333333;
		overflow: hidden;
		text-overflow:ellipsis;
		white-space: nowrap;
		margin-left: 10rpx;
	}
	.againItem-type_name{
		font-size: 24rpx;
		font-weight: 500;
		color: #555555;
		margin: 5rpx 0 10rpx 0;
		margin-left: 10rpx;
	}
	.againItem-factory_price{
		font-size: 28rpx;
		font-weight: 500;
		color: #d50000;
		margin-left: 10rpx;
	}
	.againItem-num{
		font-size: 28rpx;
		font-weight: 500;
		color: #555555;
		margin-top: 10rpx;
		margin-left: 10rpx;
	}
	/* =========================================== */

	.bargainItem {
		width: 320rpx;
		height: 460rpx;
		margin-bottom: 22rpx;
		box-shadow: 1rpx 2rpx 6rpx 0px rgba(104, 104, 104, 0.3);
		border-radius: 20rpx;
	}

	.bargainItem image {
		width: 320rpx;
		height: 276rpx;
		border-radius: 20rpx 20rpx 0 0;
	}

	.bargainItem-name {
		margin: 5rpx 0;
		font-size: 28rpx;
		font-weight: 500;
		color: #333333;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		margin-left: 10rpx;
	}

	.bargainItem-type_name {
		font-size: 24rpx;
		font-weight: 500;
		color: #555555;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		margin-left: 10rpx;
	}

	.bargainItem-factory_price {
		margin: 10rpx 0 10rpx 0;
		font-size: 24rpx;
		font-weight: 500;
		color: #333333;
		margin-left: 10rpx;
	}

	.bargainItem-num {
		font-size: 24rpx;
		font-weight: 500;
		color: #333;
		margin-left: 10rpx;
	}
</style>
